<template>
  <!-- 待收货 -->
  <div style="margin: 0 20px;">
    <el-table :data="dataList" style="width: 100%" border>
      <el-table-column prop="arrivalTime" label="发货时间" width="180">
      </el-table-column>
      <el-table-column width="180" label="是否全部发货">
        <template slot-scope="scope">
          <div>
            {{ scope.row.isAllShipment == 1 ? "全部发货" : "部分发货" }}
          </div>
        </template>
      </el-table-column>
      <el-table-column prop="driverCar" label="发货凭证（物流单号/车牌号）">
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <div style="display: flex">
            <!-- <FileDownloader :fileUrl="scope.row.filePath" :fileName="scope.row.fileName" /> -->
            <el-button
              style="font-size: 14px"
              type="text"
              @click="handqingdan(scope.row.id)"
            >
              发货清单
            </el-button>
            <el-button
            v-if="operationList.includes('shipment:receipt')"
              style="font-size: 14px"
              type="text"
              @click="handleReject(scope.row)"
            >
              确认收货
            </el-button>
          </div>
        </template>
      </el-table-column>
    </el-table>

    <div class="global-page">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes="pageSizes"
        :page-size="pageSize"
        :current-page="pageNum"
        background
        layout="sizes, total, prev, pager, next"
        :total="total"
      >
      </el-pagination>
    </div>

    <el-dialog title="发货清单" :visible.sync="dialogqingdan" width="60%">
        <el-descriptions title="" border :column="3"  direction="vertical">
            <el-descriptions-item label="地址">{{qingdanobj.address}}</el-descriptions-item>
            <el-descriptions-item label="预计到达时间">{{qingdanobj.arrivalTime}}</el-descriptions-item>
            <el-descriptions-item label="发货形式">{{qingdanobj.shipmentTypeCode}}</el-descriptions-item>
            <el-descriptions-item label="是否全部发货">
              <el-tag size="small" v-if="qingdanobj.isAllShipment==1">全部发货</el-tag>
              <el-tag size="small" type="danger" v-else>部分发货</el-tag>
            </el-descriptions-item>
            <el-descriptions-item label="发货形式名称">{{qingdanobj.shipmentTypeName}}</el-descriptions-item>
            <el-descriptions-item label="司机和车辆信息" v-if="qingdanobj.shipmentTypeCode=='huolala'">{{qingdanobj.driverCar}}</el-descriptions-item>
            <el-descriptions-item label="快递单号" v-else>{{qingdanobj.shipmentNo}}</el-descriptions-item>
            <el-descriptions-item label="体积">{{qingdanobj.volume}}</el-descriptions-item>
            <el-descriptions-item label="重量">{{qingdanobj.weight}}</el-descriptions-item>
            <el-descriptions-item label="排序">{{qingdanobj.sort}}</el-descriptions-item>
            <el-descriptions-item label="备注">{{qingdanobj.remark}}</el-descriptions-item>
            
        </el-descriptions>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogqingdan = false">取 消</el-button>
        <el-button type="primary" @click="dialogqingdan = false"
          >确 定</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>

<script>
// import FileDownloader from "@/components/utils/FileDownloader";
import APIdetail from "@/api/apidetail";
export default {
  components: {
    // FileDownloader
  },
  props: {
    operationList: Array,
    isShow: Boolean,
    currentStageid: Number,
  },
  data() {
    return {
      dataList: [],
      pageSize: 15,
      pageNum: 1,
      total: 0,
      pageSizes: [10, , 15, 20, 50],
      projectId: null,
      dialogqingdan: false,
      qingdanobj: {},
    };
  },
  methods: {
    handleReject(row) {
     if(row.projectId){
        let params = {
            projectId: row.projectId,
        }
        APIdetail.sureShipment(params).then(res=>{
           if(res.key == 1000){
            this.$message.success(res.message);
            this.$emit('get-stage')
           }
        })
     }
    },

    getshipment() {
      let params = {
        keyword: "",
        pageNum: this.pageNum,
        pageSize: this.pageSize,
        projectId: this.projectId,
        stageId: this.currentStageid,
      };
      APIdetail.shipmentquery(params).then((res) => {
        if (res.key == 1000) {
          this.dataList = res.result.list;
        }
      });
    },
    // 分页pageSize改变
    handleSizeChange(e) {
      this.pageSize = e;
    },
    // 分页pageNum改变
    handleCurrentChange(e) {
      this.pageNum = e;
    },
    handqingdan(id) {
      if (id) {
        let params = {
          id: id,
        };
        APIdetail.shipmentgetDatils(params).then((res) => {
          if (res.key == 1000) {
            this.qingdanobj = res.result.data;
            this.dialogqingdan = true;
          }
        });
      }
    },
  },

  created() {
    let projectId = this.$ls.get("projectId");
    this.projectId = projectId;
    this.getshipment();
  },
};
</script>
